<template>
  <div class="canvas-wrapper" ref="d3">
    
  </div>
</template>

<style >
.canvas-wrapper{
  width: 100%;  
  height: 100%;
  position: relative;
}
.canvas-wrapper canvas{
    width: 100%;
    height: 100%;
  }
</style>
<script setup lang="ts">
import { onMounted,ref, type Ref } from 'vue';
import { initScene } from '../components/initScene';
import { initTank } from '../components/tank';
const d3:Ref<HTMLElement> = ref(null);
const stage =  initScene({antialias:true});
onMounted(()=>{
  d3.value.appendChild (stage.renderer.domElement);
  const {camera,renderer,scene,controls} = stage;
  stage.resize()
  initTank(camera,renderer,scene,controls);
})
</script>
